﻿{% extends 'blogapp/base.html' %}
{% block content %}
    <div id="main-container" class="container clearfix">
        <section class="post-left">
            <div class="breadcrumb">您的位置： <a itemprop="breadcrumb" href="{% url 'blogapp:index' %}">首页</a> » <span
                    class="current">标签：{{ tag_name }}</span></div>
            <div class="index-main clearfix">
                <div class="main-title">
                    <h4 class="post-left-title">标签：{{ tag_name }}</h4>
                </div>
                <div class="row">

                    {% for tag_artical in page_list_obj %}
                        <div class="article-box clearfix excerpt-1">
                            <div class="col-md-4">
                                <div class="thumbnail">
                                    <a href="{% url 'blogapp:article_detail' tag_artical.category.code tag_artical.pk %}"
                                       title="{{ list.title }}">
                                        <img src="{{ MEDIA_URL }}{{ tag_artical.img }}"
                                             srcset="{{ MEDIA_URL }}{{ tag_artical.img }}"
                                             alt="{{ tag_artical.title }}" class="wp-post-image" width="240"
                                             height="160"/></a>
                                </div>
                            </div>
                            <div class="col-md-8">
                                <h2>
                                    <a href="{% url 'blogapp:article_detail' tag_artical.category.code tag_artical.pk %}"
                                       target="_blank"
                                       title="{{ tag_artical.title }}">{{ tag_artical.title }}</a></h2>
                                <p class="txtcont hidden-xs"><a
                                        href="{% url 'blogapp:article_detail' tag_artical.category.code tag_artical.pk %}"
                                        target="_blank"
                                        title="{{ tag_artical.title }}">{{ tag_artical.excerpt }}</a></p>
                                <div class="meta"><span class="label label-info"><a
                                        href="{% url 'blogapp:article_list' tag_artical.category.code %}">{{ tag_artical.category.name }}</a></span>
                                    <time class="item"><i
                                            class="fa fa-clock-o"></i>{{ tag_artical.create_time|date:"Y年m月d日 H:i:s" }}
                                    </time>
                                </div>
                            </div>
                        </div>
                    {% endfor %}

                    <!--分页机制-->
                    <div class="pagination">
                        <ul>
                            {% if page_list_obj.has_previous %}
                                <li class="prev-page"><a href="?page={{ page_list_obj.previous_page_number }}">上一页</a>
                                </li>
                            {% else %}
                                <li class="prev-page"></li>
                            {% endif %}


                            {% for num in page_list_obj.paginator.page_range %}
                                {% if num %}
                                    {% if num == page_list_obj.number %}
                                        <li class="active"><span>{{ num }}</span></li>
                                    {% else %}
                                        <li><a href="?page={{ num }}">{{ num }}</a></li>
                                    {% endif %}
                                {% else %}
                                    <li class="disabled"><span>...</span></li>
                                {% endif %}
                            {% endfor %}



                            {% if page_list_obj.has_next %}
                                <li class="next-page"><a href="?page={{ page_list_obj.next_page_number }}">下一页</a></li>
                            {% else %}
                                <li class="prev-page"></li>
                            {% endif %}
                        </ul>
                    </div>

                </div>
            </div>
        </section>
        <!-- /post-left -->
        <!-- /post-right -->
        <aside class="post-right hidden-xs">

            {% include 'blogapp/right.html' %}

        </aside>
    </div>
{% endblock %}